<template>
  <div>
    <el-drawer class="drawer" title="" :visible.sync="drawer" direction="rtl">
      <div class="drawer-container" v-loading="loading" style="">
        <!-- 日租订单信息 -->
        <div class="drawer-body" v-if="orderInfo && orderInfo.orderType==='2' && houseInfo && lessee && list">
          <div class="drawer-main" style="padding: 20px 30px;height:750px;overflow-y:auto;margin-bottom: 80px;">
            <el-tabs v-model="activeName">
              <el-tab-pane label="基本信息" name="first">
                <el-descriptions title="房屋信息" :column="1">
                  <el-descriptions-item label="名称">
                    {{ houseInfo.premisesAddress }}
                  </el-descriptions-item>
                  <el-descriptions-item label="户型">
                    {{ houseInfo.roomType }}室
                    {{ houseInfo.hall }}厅
                    {{ houseInfo.toilet }}卫
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="基础信息" :column="1">
                  <el-descriptions-item label="租住方式">
                    <dict-tag :options="dict.type.order_type" :value="orderInfo.orderType"/>
                  </el-descriptions-item>
                  <el-descriptions-item label="状态">
                    <dict-tag :options="dict.type.order_all_state" :value="orderInfo.orderState"/>
                  </el-descriptions-item>
                  <el-descriptions-item label="入离">
                    {{ orderInfo.checkInTime | formatDate('MM-DD') }}至
                    {{ orderInfo.checkOutTime | formatDate('MM-DD') }}
                  </el-descriptions-item>
                  <el-descriptions-item label="入住天数">{{
                      DateDiff(orderInfo.checkInTime, orderInfo.checkOutTime)
                    }}晚
                  </el-descriptions-item>
                  <el-descriptions-item label="来源">嗨小克小程序</el-descriptions-item>
                  <el-descriptions-item label="预定房间">
                    {{ orderInfo.premisesAddress }}
                  </el-descriptions-item>
                  <el-descriptions-item label="住客姓名">{{
                      orderInfo.orderLessee.lesseeName
                    }}
                  </el-descriptions-item>
                  <el-descriptions-item label="住客手机">{{
                      orderInfo.orderLessee.phone
                    }}
                  </el-descriptions-item>
                  <el-descriptions-item label="身份证号">{{
                      orderInfo.orderLessee.cardNumber
                    }}
                  </el-descriptions-item>
                  <el-descriptions-item label="订单号">{{
                      orderInfo.orderLessee.orderId
                    }}
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="费用信息" :column="1">
                  <el-descriptions-item label="房费"
                                        v-if="!['101', '102', '151', '153'].includes(orderInfo.orderState)"
                  >{{
                      orderInfo.totalRent
                    }}元
                  </el-descriptions-item>
                  <el-descriptions-item label="押金"
                                        v-if="!['101', '102', '151', '153'].includes(orderInfo.orderState)"
                  >{{
                      orderInfo.deposit
                    }}元
                  </el-descriptions-item>
                  <el-descriptions-item label="优惠金额"
                                        v-if="!['101', '102', '151', '153'].includes(orderInfo.orderState)&&orderInfo.couponPrice"
                  >{{
                      orderInfo.couponPrice
                    }}元
                  </el-descriptions-item>
                  <el-descriptions-item label="续租">{{ orderInfo.reletPrice }}元</el-descriptions-item>
                  <el-descriptions-item label="延迟退房"
                                        v-if="orderInfo.orderState === '107' || orderInfo.orderState === '108'"
                  >
                    {{
                      orderRefundItemByRefundType(4)
                    }}元
                  </el-descriptions-item>
                  <el-descriptions-item label="已住房费" v-if="orderInfo.orderState === '108'">{{
                      orderInfo.checkInPrice
                    }}元
                  </el-descriptions-item>
                  <el-descriptions-item label="退订费" v-if="orderInfo.orderState === '108'">{{
                      orderInfo.unsubscribePrice
                    }}元
                  </el-descriptions-item>
                  <el-descriptions-item label="损坏赔偿" v-if="orderInfo.orderState === '108'">{{
                      orderRefundItemByRefundType(3)
                    }}元
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions title="入住信息" :column="1"
                                 v-if="orderInfo.orderState === '106' || orderInfo.orderState === '107' || orderInfo.orderState === '108'"
                >
                  <el-descriptions-item label="入住时间">{{ orderInfo.realityCheckInTime }}</el-descriptions-item>
                  <el-descriptions-item label="退房时间"
                                        v-if="orderInfo.orderState === '107' || orderInfo.orderState === '108'"
                  >
                    {{
                      orderInfo.realityCheckOutTime
                    }}
                  </el-descriptions-item>
                  <el-descriptions-item label="退房单号"
                                        v-if="orderInfo.orderState === '107' || orderInfo.orderState === '108'"
                  >
                    {{
                      orderInfo.checkOutOrder ? orderInfo.checkOutOrder.checkOutOrderId : ''
                    }}
                  </el-descriptions-item>
                </el-descriptions>
              </el-tab-pane>
              <el-tab-pane label="住客" name="second" v-if="memberList.length > 0">
                <div v-if="drawer">
                  <div class="member-title">承租人</div>
                  <div class="member-box">
                    <div>住客：{{ lessee.memberName }}<i
                      :class="lessee.sex?lessee.sex==='1'?'el-icon-male':'el-icon-female':''"
                    ></i></div>
                    <div>手机号：{{ lessee.memberPhone }}</div>
                    <div>身份证：{{ lessee.idCard }}</div>
                  </div>
                  <div class="member-title">同住人</div>
                  <template v-for="(item) in list.filter(item => item.memberType !== '1')">
                    <div class="member-box" v-if="item.memberType !== '1'" :key="item.memberId">
                      <div>
                        <div>住客：{{ item.memberName }} <i
                          :class="item.sex?item.sex==='1'?'el-icon-male':'el-icon-female':''"
                        ></i></div>
                        <div>手机号：{{ item.memberPhone }}</div>
                        <div>身份证：{{ item.idCard }}</div>
                      </div>
                      <div style="margin-top: 20px">
                        <el-button size="small" @click="putMember(item)">编辑</el-button>
                        <el-button size="small" @click="delMember(item)">删除</el-button>
                      </div>
                    </div>
                  </template>
                  <template v-if="list.filter(item => item.memberType !== '1').length === 0">
                    <div class="member-box" style="text-align: center;margin-top: 20px">
                      <div>暂无人员信息</div>
                    </div>
                  </template>
                  <el-button style="margin-top: 20px" size="small" @click="addMemberHandel">添加同住人
                  </el-button>
                </div>
              </el-tab-pane>
            </el-tabs>
          </div>

        </div>
      </div>
      <div class="drawer-footer" v-if="activeName === 'first'">
        <el-row>
          <el-col>
            <el-button size="small" @click="checkInShow" v-if="orderInfo.orderState === '103'">入住</el-button>
            <el-button size="small" @click="handleSweepInspection"
                       v-if="orderInfo.orderState === '106' || orderInfo.orderState === '107' || orderInfo.orderState === '108'"
            >打扫验房
            </el-button>
            <el-button size="small" v-if="orderInfo.orderState === '106'" @click="handleRentVisible">续租
            </el-button>
            <el-button size="small" v-if="orderInfo.orderState === '103' || orderInfo.orderState === '106'
                  " @click="handleChangeHouse"
            >换房
            </el-button>
            <el-button size="small" @click="cancelShow" v-if="orderInfo.orderState === '103'">退订</el-button>
            <el-button size="small" @click="outhandleVisible = true" v-if="orderInfo.orderState === '104'">退订处理
            </el-button>
            <el-button size="small" v-if="orderInfo.orderState === '106'" @click="handleCheckOut">退房</el-button>
            <el-button size="small" @click="checkVisible = true" v-if="orderInfo.orderState === '107'">验房结算
            </el-button>
            <el-button size="small" @click="checkVisible = true" v-if="orderInfo.orderState === '108'">退房详情
            </el-button>
          </el-col>
        </el-row>
      </div>
    </el-drawer>

    <!-- 入住 -->
    <el-dialog title="入住" :visible.sync="checkInVisible" width="500px">
      <el-descriptions title="" :column="2">
        <el-descriptions-item label="房间">
          {{
            orderInfo.houseNew ? orderInfo.houseNew.premisesAddress : orderInfo.premisesAddress
          }}

        </el-descriptions-item>
        <el-descriptions-item label="订单状态">
          <dict-tag :options="dict.type.order_all_state" :value="orderInfo.orderState"/>
        </el-descriptions-item>
        <el-descriptions-item label="入离时间">
          {{ orderInfo.checkInTime | formatDate('MM-DD') }}至
          {{ orderInfo.checkOutTime | formatDate('MM-DD') }}
        </el-descriptions-item>
        <el-descriptions-item label="入离时间">
          {{ orderInfo.rentDay }}晚
        </el-descriptions-item>
      </el-descriptions>
      <el-form ref="checkinform" :model="checkInform" label-width="80px">
        <el-form-item label="入住时间" prop="realityCheckInTime" :rules="[
          { required: true, message: '请选择入住时间', trigger: 'change' },
        ]"
        >
          <el-date-picker v-model="checkInform.realityCheckInTime" style="width: 240px" format="yyyy-MM-dd HH:mm"
                          value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期"
                          :picker-options="chieckInTimeOptions"
          ></el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="checkInVisible = false">取 消</el-button>
        <el-button type="primary" @click="checkInHandel">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 退订 -->
    <el-dialog title="退订" :visible.sync="checkOutVisible" width="500px">
      <el-descriptions title="" :column="2">
        <el-descriptions-item label="房间">{{
            orderInfo.houseNew ? orderInfo.houseNew.premisesAddress : orderInfo.premisesAddress
          }}
        </el-descriptions-item>
        <el-descriptions-item label="订单状态">
          <dict-tag :options="dict.type.order_all_state" :value="orderInfo.orderState"/>
        </el-descriptions-item>
        <el-descriptions-item label="入离时间">
          {{ orderInfo.checkInTime | formatDate('MM-DD') }}至
          {{ orderInfo.checkOutTime | formatDate('MM-DD') }}
        </el-descriptions-item>
        <el-descriptions-item label="入离时间">
          {{ orderInfo.rentDay }}晚
        </el-descriptions-item>
      </el-descriptions>
      <el-form ref="checkOutForm" :model="checkOutForm" label-width="80px">
        <el-form-item label="取消原因" :rules="[
          { required: true, message: '请输入取消原因', trigger: 'change' },
        ]" prop="recordReason"
        >
          <el-select v-model="checkOutForm.recordReason" placeholder="取消原因" clearable style="width: 240px">
            <el-option v-for="dict in dict.type.cancel_reservation" :key="dict.value" :label="dict.label"
                       :value="dict.label"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="checkOutVisible = false">取 消</el-button>
        <el-button type="primary" @click="checkOutHandel">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 换房 -->
    <el-dialog title="换房" :visible.sync="changeVisible" width="500px">
      <el-descriptions title="" :column="2">
        <el-descriptions-item label="房间">{{
            orderInfo.houseNew ? orderInfo.houseNew.premisesAddress : orderInfo.premisesAddress
          }}
        </el-descriptions-item>
        <el-descriptions-item label="订单状态">
          <dict-tag :options="dict.type.order_all_state" :value="orderInfo.orderState"/>
        </el-descriptions-item>
        <el-descriptions-item label="入离时间">
          {{ orderInfo.checkInTime | formatDate('MM-DD') }}至
          {{ orderInfo.checkOutTime | formatDate('MM-DD') }}
        </el-descriptions-item>
        <el-descriptions-item label="入住天数">
          {{ DateDiff(orderInfo.checkInTime, orderInfo.checkOutTime) }}晚
        </el-descriptions-item>
      </el-descriptions>
      <el-form ref="changeform" :model="changeform" label-width="80px">
        <el-form-item label="换后房间" :rules="[{ required: true, message: '请选择换后房间', trigger: 'change' }]"
                      prop="premisesAddress"
        >
          <el-input style="width: 200px; margin-left: 10px" v-model="changeform.premisesAddress"
                    placeholder="请选择房屋"
                    readonly
          ></el-input>
          <el-button size="small" type="primary" icon="el-icon-s-home"
                     @click="dialogSelectHouseVisible = true"
          >选择房屋
          </el-button>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="changeVisible = false">取 消</el-button>
        <el-button type="primary" @click="changeHandel">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 续租 -->
    <el-dialog title="续租" :visible.sync="rentVisible" width="500px">
      <el-descriptions title="" :column="2">
        <el-descriptions-item label="房间">{{
            orderInfo.houseNew ? orderInfo.houseNew.premisesAddress : orderInfo.premisesAddress
          }}
        </el-descriptions-item>
      </el-descriptions>
      <el-form ref="rentform" :model="rentform" label-width="80px" :rules="rentformRules">
        <el-form-item label="续住天数" prop="rentDay">
          <el-input style="width: 200px; margin-left: 10px" v-model="rentform.rentDay"
                    placeholder="请输入续租天数"
                    maxlength="6"
                    @change="(e)=>rentform.rentDay=Number(e)"
          ></el-input>
          <div v-if="rentform.rentDay && rentform.rentDay > 0">入离：{{
              orderInfo.checkOutTime | formatDate('MM-DD')
            }}
            至{{ getDate(orderInfo.checkOutTime, rentform.rentDay, 'MM-DD') }}
          </div>
        </el-form-item>
        <el-form-item label="付款方式">
          <el-radio-group v-model="rentform.payMethod">
            <el-radio :label="1">小程序支付</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="rentVisible = false">取 消</el-button>
        <el-button type="primary" @click="rentHandel">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 退房 -->
    <el-dialog title="退房" :visible.sync="outVisible" width="500px">
      <el-descriptions title="" :column="2">
        <el-descriptions-item label="房间">{{
            orderInfo.houseNew ? orderInfo.houseNew.premisesAddress : orderInfo.premisesAddress
          }}
        </el-descriptions-item>
        <el-descriptions-item label="订单状态">
          <dict-tag :options="dict.type.order_all_state" :value="orderInfo.orderState"/>
        </el-descriptions-item>
        <el-descriptions-item label="入离时间">
          {{ orderInfo.checkInTime | formatDate('MM-DD') }}至
          {{ orderInfo.checkOutTime | formatDate('MM-DD') }}
        </el-descriptions-item>
        <el-descriptions-item label="入住天数">
          <!--          {{ orderInfo.rentDay }}晚-->
          {{ DateDiff(orderInfo.checkInTime, orderInfo.checkOutTime) }}晚
        </el-descriptions-item>
        <el-descriptions-item label="入住时间">
          {{ orderInfo.realityCheckInTime | formatDate('YYYY-MM-DD HH:mm') }}
        </el-descriptions-item>
      </el-descriptions>
      <el-form ref="outform" :model="outform" label-width="80px">
        <el-form-item label="退房时间" :rules="[{ required: true, message: '请输入退房时间', trigger: 'change' }]"
                      prop="realityCheckOutTime"
        >
          <el-date-picker type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"
                          format="yyyy-MM-dd HH:mm"
                          v-model="outform.realityCheckOutTime" :picker-options="checkOutTimeOptions"
                          :default-time="checkOutDefaultTime"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="延迟退房费" :rules="[{ required: true, message: '请选择', trigger: 'change' }]"
                      prop="chargeType"
                      v-if="isDelayCheckOut"
        >
          <el-radio-group v-model="outform.chargeType">
            <el-radio label="0">不收取</el-radio>
            <el-radio label="1">收取</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="收取金额" :rules="[{ required: true, message: '请输入收费金额', trigger: 'change' }]"
                      prop="totalPrice"
                      v-if="isDelayCheckOut&&outform.chargeType === '1'"
        >
          <el-input style="width: 200px; margin-left: 10px" v-model.number="outform.totalPrice" placeholder="请输入"
                    type="number"
          >
            <span slot="append">元</span>
          </el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="outVisible = false">取 消</el-button>
        <el-button type="primary" @click="outHandel">确 定</el-button>
      </span>
    </el-dialog>
    <SelectHouse v-model="dialogSelectHouseVisible" @success="selectHouseCb" :filterId="orderInfo.houseId"/>
    <condition-check v-if="outhandleVisible" v-model="outhandleVisible" :orderId="orderInfo.orderId"
                     :recordId="orderInfo.orderAuditRecord.recordId"
                     @input="closeCheck"
    ></condition-check>
    <!-- 同住人操作 -->
    <el-dialog :title="membertitle" :visible.sync="memberVisible" width="500px">
      <el-form :model="perform" ref="perform" label-width="120px">
        <el-form-item label="住客名称" prop="memberName" :rules="[
          { required: true, message: '请输入住客名称', trigger: 'blur' },
        ]"
        >
          <el-input v-model="perform.memberName" :disabled="!!perform.memberId"></el-input>
        </el-form-item>
        <el-form-item label="手机号" prop="memberPhone" :rules="[
          { required: true, message: '请输入手机号', trigger: 'blur' },
          {
            pattern: /^1[3-9][0-9]\d{8}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur'
          }
        ]"
        >
          <el-input v-model="perform.memberPhone" maxlength="11" v-input.int></el-input>
        </el-form-item>
        <el-form-item label="身份证号" prop="idCard" :rules="[
          { required: true, message: '请输入身份证号', trigger: 'blur' },
        ]"
        >
          <el-input v-model="perform.idCard" :disabled="!!perform.memberId"></el-input>
        </el-form-item>
        <el-form-item label="识别照片">
          <ImageUpload v-model="perform.faceImage" :limit="1"/>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="memberVisible = false">取 消</el-button>
        <el-button type="primary" @click="perSubmit">确 定</el-button>
      </span>
    </el-dialog>
    <!--  验房结算弹窗  -->
    <check-house v-if="checkVisible" v-model="checkVisible" :orderId="orderInfo.orderId" @input="closeCheck"
    ></check-house>
    <!-- 打扫验房 -->
    <SweepInspection v-model="sweepInspection" :orderInfo="orderInfo"/>
  </div>
</template>

<script>
import { getDayOrWeek, inTime, DateDiff } from '@/utils/common/time'
import {
  houseDynamic,
  checkIn,
  cancelReservation,
  exchangeHouse,
  relet,
  checkingOut,
  memberList,
  memberAdd,
  memberPut,
  memberDel
} from '@/api/house/condition'
import checkHouse from '@/views/house/condition/components/check-house.vue'
import SweepInspection from '@/views/house/condition/components/sweep-inspection/index.vue'
import SelectHouse from '@/views/house/condition/components/select-house.vue'
import conditionCheck from '@/views/house/condition/components/condition-check.vue'
import { debounce } from '@/utils'
import { compareDate, compareDateTime, getDate, isBetween } from '@/utils/common/moment'

export default {
  name: 'Info',
  components: { conditionCheck, SelectHouse, SweepInspection, checkHouse },
  dicts: ['cancel_reservation', 'order_all_state', 'order_type', 'order_source', 'trading_mode'],
  props: {
    value: {
      type: Boolean,
      default: false
    },
    orderId: {
      default: ''
    }
  },
  data() {
    return {
      loading: false,
      activeName: 'first',
      orderInfo: {},
      // 住客列表
      memberList: [],
      lessee: {},
      list: [],
      // 入住弹窗
      checkInVisible: false,
      //入住日期配置
      chieckInTimeOptions: {
        disabledDate: (time) => {
          return time.getTime() < new Date(this.orderInfo.checkInTime) || time.getTime() >= new Date(this.orderInfo.checkOutTime)
        }
      },
      // 退订弹窗
      checkOutVisible: false,
      // 续租弹窗
      rentVisible: false,
      rentform: {},
      rentformRules: {
        rentDay: [
          { required: true, message: '请输入续租天数', trigger: 'change' },
          {
            validator: (rules, value, callback) => {
              if (value <= 0) {
                callback(new Error('续租天数需大于0'))
              }
              callback()
            }, trigger: 'blur'
          }
        ]
      },
      // 换房弹窗
      changeVisible: false,
      changeform: {},
      // 选择房屋弹窗
      dialogSelectHouseVisible: false,
      //退订处理弹窗
      outhandleVisible: false,
      outform: {
        orderId: '', //订单id
        chargeType: '', //0不收取，1收取
        totalPrice: null, //延迟退房费
        realityCheckOutTime: '' //退房时间
      },
      checkOutDefaultTime: '',
      //退房弹窗
      outVisible: false,
      //退房日期配置
      checkOutTimeOptions: {
        disabledDate: (time) => {
          return compareDate(time, this.orderInfo.checkInTime, '<')
        }
      },
      // 验房结算弹窗
      checkVisible: false,
      //打扫验房
      sweepInspection: false,
      // 同住人操作弹窗
      memberVisible: false,
      membertitle: '添加同住人',
      perform: {
        houseId: '',
        orderId: '',
        memberType: '3',
        memberName: '',
        memberPhone: '',
        memberRelation: '5',
        sex: '1',
        idCard: '',
        faceImage: ''
      },
      // 入住表单
      checkInform: {
        realityCheckInTime: ''
      },
      // 退订表单
      checkOutForm: {
        recordReason: ''
      }
    }
  },
  computed: {
    drawer: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('input', val)
      }
    },
    // 房屋信息
    houseInfo() {
      if (this.orderInfo && this.orderInfo.orderId) {
        return this.orderInfo.houseNew ? this.orderInfo.houseNew : this.orderInfo.house
      }
      return {}
    },
    // 退费类型(1.房费,2.押金,3.损坏赔偿,4.延迟退房费)
    orderRefundItemByRefundType() {
      return (type) => {
        let orderRefundItemList = this.orderInfo.orderRefundItemList
        if (orderRefundItemList && orderRefundItemList.length) {
          let Item = orderRefundItemList.find(item => item.refundType == type)
          return Item ? Item.itemSum : 0
        }
        return ''

      }
    },
    // 是否延迟退房
    isDelayCheckOut() {
      if (this.outform.realityCheckOutTime && this.orderInfo.checkOutTime) {
        let realityCheckOutTime = new Date(this.outform.realityCheckOutTime)
        let checkOutTime = new Date(this.orderInfo.checkOutTime)
        let timeArr = this.orderInfo.housingAllocation.checkOutTime.split(':')
        return realityCheckOutTime > checkOutTime.setHours(timeArr[0], timeArr[1], 0)
      }

      return false
    }
  },
  watch: {
    value: {
      handler(val) {
        if (val) {
          this.init()
        }
      },
      immediate: true
    }
  },
  methods: {
    getDate,
    DateDiff: DateDiff,
    closeCheck() {
      this.$emit('success')
      this.drawer = false
    },
    init() {
      this.reset()
      this.getOrderinfo()
    },
    reset() {
      this.activeName = 'first'
      this.orderInfo = ''
      this.lessee = {}
      this.list = []
    },
    // 获取订单信息
    getOrderinfo() {
      this.loading = true
      houseDynamic(this.orderId).then((res) => {
        this.orderInfo = res.data
        this.getperList()
        this.loading = false
      }).catch(() => {
        this.loading = false
      })
    },
    // 获取同住人列表
    getperList() {
      console.log('getPerList')
      this.lessee = {}
      let params = {
        orderId: this.orderInfo.orderId,
        houseId: this.orderInfo.houseId
      }
      memberList(params).then((res) => {
        let list = res.rows
        this.memberList = res.rows
        let lessee = list.filter((item) => item.memberType === '1')
        if (lessee.length) {
          this.lessee = lessee[0]
        }
        this.list = list
      })
    },

    //新增
    addMemberHandel() {
      this.membertitle = '添加同住人'
      this.perform = this.$options.data().perform
      this.memberVisible = true
    },
    //编辑同住人
    putMember(row) {
      this.membertitle = '编辑同住人'
      this.perform = JSON.parse(JSON.stringify(row))
      this.memberVisible = true
    },
    //新增/编辑同住人
    perSubmit() {
      this.perform.orderId = this.orderInfo.orderId
      this.perform.houseId = this.orderInfo.houseId
      const getSex = (no = '') => {
        if (!no) return no
        const toStr = no.toString()
        if (toStr.length < 17) return no
        return Number(toStr.substring(16, 17)) % 2 ? '1' : '2' //1男 2女
      }
      this.$refs['perform'].validate((valid) => {
        if (valid) {
          if (this.perform.memberId) {
            memberPut(this.perform).then((res) => {
              this.$modal.msgSuccess(res.msg || '编辑成功')
              this.getperList()
              this.memberVisible = false
            })
          } else {
            this.perform.sex = getSex(this.perform.idCard)
            memberAdd(this.perform).then((res) => {
              this.$modal.msgSuccess(res.msg || '新增成功')
              this.getperList()
              this.memberVisible = false
            })
          }
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    // 删除同住人
    delMember(row) {
      this.$confirm('确认删除住客？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        memberDel(row.memberId).then((res) => {
          this.$message({
            type: 'success',
            message: res.msg || '删除成功!'
          })
          this.getperList()
        })
      })
    },
    // 入住
    checkInShow() {
      console.log('this.orderInfo.sweepState', this.orderInfo.sweepState)
      if (this.orderInfo.sweepState === '1' || this.orderInfo.sweepState === '2') {
        this.$confirm('房间未完成打扫，是否确认入住？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.checkInform.realityCheckInTime = this.$moment().format('YYYY-MM-DD HH:mm:ss')
          this.checkInVisible = true
        })
      } else {
        this.checkInform.realityCheckInTime = this.$moment().format('YYYY-MM-DD HH:mm:ss')
        this.checkInVisible = true
      }
    },
    //退订
    checkOutHandel() {
      let data = {
        orderId: this.orderInfo.orderId,
        recordReason: this.checkOutForm.recordReason
      }
      this.$refs['checkOutForm'].validate((valid) => {
        if (valid) {
          cancelReservation(data).then((res) => {
            this.$modal.msgSuccess(res.msg || '退订成功')
            this.getOrderinfo()
            this.$emit('success')
            this.checkOutVisible = false
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    // 打扫验房操作
    handleSweepInspection() {
      this.sweepInspection = true
    },
    //操作续租
    handleRentVisible() {
      // if (this.orderInfo.checkLinkedOrder == 1) {
      //   this.$message.error('房间有正在办理的续租业务，请处理后再试')
      //   return
      // }
      this.rentform = {
        orderId: '', //订单id
        rentDay: null, //续租天数,
        payMethod: 1
      }
      this.rentVisible = true
    },
    //续租处理
    rentHandel: debounce(function() {
      this.rentform.orderId = this.orderInfo.orderId
      this.$refs['rentform'].validate((valid) => {
        if (valid) {
          relet(this.rentform).then((res) => {
            this.$modal.msgSuccess(res.msg || '操作成功')
            this.getOrderinfo()
            this.$emit('success')
            this.rentVisible = false
            this.changeVisible = false
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    }, 300, false),
    //换房弹窗操作
    handleChangeHouse() {
      this.changeVisible = true
      this.changeform = {}
    },
    //换房处理
    changeHandel() {
      this.changeform.orderId = this.orderInfo.orderId
      this.$refs['changeform'].validate((valid) => {
        if (valid) {
          exchangeHouse(this.changeform).then((res) => {
            this.$modal.msgSuccess(res.msg || '换房成功')
            this.getOrderinfo()
            this.$emit('success')
            this.changeVisible = false
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    //房间选择回调
    selectHouseCb(data) {
      this.selectHouseObj = data
      let houseObj = {
        houseId: '', //房屋id
        provinceId: '', //省
        provinceName: '', //省份名称
        cityId: '', //市
        cityName: '', //市名称
        districtId: '', //区
        districtName: '', //区名称
        streetId: '', //所属街道
        streetName: '', //街道名称
        communityId: '', //所属社区
        communityName: '', //所属社区名称
        premisesAddress: null, //小区地址
        roomNumber: '', // 房间 号
        estateId: '', //楼盘id
        estateName: '', //楼盘名称
        buildingId: '', //楼栋id
        buildingName: '', //楼栋名称
        unitId: '', //单元id
        unitName: '', //单元名称
        floors: undefined //层数
      }
      for (const key in houseObj) {
        houseObj[key] = data[key]
      }
      this.changeform = { ...this.changeform, ...houseObj }
    },
    //入住
    checkInHandel() {
      let data = {
        orderId: this.orderInfo.orderId,
        realityCheckInTime: this.checkInform.realityCheckInTime
      }
      this.$refs['checkinform'].validate((valid) => {
        if (valid) {
          //判断实际入住日期小于入住日期
          let realityCheckInTime = new Date(this.checkInform.realityCheckInTime)
          let checkInTime = new Date(this.orderInfo.checkInTime)
          if (realityCheckInTime < checkInTime) {
            this.$message.error('未到入住日期，不能进行入住')
            return
          }
          checkIn(data).then((res) => {
            this.$modal.msgSuccess(res.msg || '入住成功')
            this.getOrderinfo()
            this.$emit('success')
            this.checkInVisible = false
          })
        }
      })
    },
    // 退订
    cancelShow() {
      this.checkOutVisible = true
    },
    //退房
    handleCheckOut() {
      this.outform = {
        orderId: '', //订单id
        chargeType: '', //0不收取，1收取
        totalPrice: null, //延迟退房费
        realityCheckOutTime: '' //退房时间
      }
      this.checkOutDefaultTime = this.formatDate(new Date(), 'YYYY-MM-DD HH:mm:ss')
      this.outVisible = true
    },
    //退房
    outHandel() {
      this.outform.orderId = this.orderInfo.orderId

      this.$refs['outform'].validate((valid) => {
        if (valid) {
          //退房时间小于入住时间
          if (compareDateTime(this.orderInfo.realityCheckInTime, this.outform.realityCheckOutTime, '>')) {
            this.$message.error('退房时间不能小于入住时间')
            return
          }
          console.log('outform', this.outform)

          checkingOut(this.outform).then((res) => {
            this.$modal.msgSuccess(res.msg || '操作成功')
            this.getOrderinfo()
            this.$emit('success')
            this.outVisible = false
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    }
  }

}
</script>

<style lang="scss" scoped>
.member-title {
  color: #303133;
  font-size: 16px;
  font-weight: bold;
}

.member-box {
  border: 1px solid #666;
  border-radius: 4px;
  padding: 20px;
  margin: 20px 0;
  color: #606266;
  line-height: 1.5;
  font-size: 14px;
}

.query-button {
  margin-bottom: 30px;
}

.drawer-footer {
  background: #fff;
  bottom: 0;
  position: absolute;
  width: 100%;
  height: 80px;
  padding: 10px 30px;
}
</style>
